<template>
    <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
        <el-tab-pane label="产业概览" name="first">
            <div class="wrapper main-wrapper row">
                <div class="col-lg-12">
                    <section class="box nobox marginBottom0">
                        <div class="content-body">
                            <div class="row">
                                <smallCard>
                                    <template #cardbox>
                                        <div class="stats">
                                            <h3 class="color-white numbers">143352</h3>
                                            <span>企业总数量</span>
                                        </div>
                                    </template>
                                </smallCard>
                                <smallCardHover>
                                    <template #textOne>
                                        <div class="stats">
                                            <h3 class="numbers">2483</h3>
                                            <span>高新企业总数量</span>
                                        </div>
                                    </template>
                                </smallCardHover>
                                <smallCardHover>
                                    <template #textTwo>
                                        <div class="stats">
                                            <h3 class="numbers">367474</h3>
                                            <span>2+4+6 企业总数量</span>
                                        </div>
                                    </template>
                                </smallCardHover>
                            </div>
                        </div>
                    </section>
                </div>
                <div class="clearfix"></div>
                <div class="col-lg-8">
                    <mainImage title="主图">
                        <template #mianMap>
                            <div class="row">
                                <div class="col-xs-12">
                                    <div class="row" style="height: 415px;">
                                        <div class="panel-box">
                                            <div class="panel-box-title">
                                                <h5>Monthly View</h5>
                                            </div>
                                            <div class="panel-box-content">
                                                <div id="visitor" style="height:415px;"></div>
                                            </div>
                                        </div>

                                    </div>
                                </div>
                            </div>
                        </template>
                    </mainImage>
                </div>
                <div class="col-lg-4">
                    <sameCard title="招商工具集">
                        <template #tool>
                            <div
                                style="height: 385px;width: 100%;background: linear-gradient(#9d73fa,#3d5ae6);padding-top: 15px;">
                                <div class="col-xs-3" style="padding: 10px; " @click="navigateToTargetPagemb">
                                    <div class="icon-box">
                                        <label
                                            style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;color: #fff;display: flex;align-items: center; justify-content: center;"><el-icon
                                                class="el-icon" style="font-size: 26px;">
                                                <el-icon-document-copy />
                                            </el-icon></label><span
                                            style="font-size:12px ;color: #fff;display: flex;justify-content: center;">目标客户池</span>
                                    </div>
                                </div>
                                <div class="col-xs-3" style="padding: 10px; " @click="navigateToTargetPagewdsc">
                                    <div class="icon-box">
                                        <label
                                            style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;color: #fff;display: flex;align-items: center; justify-content: center;"><el-icon
                                                class="el-icon" style="font-size: 26px;">
                                                <el-icon-collection-tag />
                                            </el-icon></label><span
                                            style="font-size:12px ;color: #fff;display: flex;justify-content: center;">我的收藏</span>
                                    </div>
                                </div>
                                <div class="col-xs-3" style="padding: 10px;" @click="navigateToTargetPagexs">
                                    <div class="icon-box">
                                        <label
                                            style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;color: #fff;display: flex;align-items: center; justify-content: center;"><el-icon
                                                class="el-icon" style="font-size: 26px;">
                                                <el-icon-connection />
                                            </el-icon></label><span
                                            style="font-size:12px ;color: #fff;display: flex;justify-content: center;">线索管理</span>
                                    </div>
                                </div>
                                <div class="col-xs-3" style="padding: 10px;" @click="navigateToTargetPagexsfp">
                                    <div class="icon-box">
                                        <label
                                            style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;color: #fff;display: flex;align-items: center; justify-content: center;"><el-icon
                                                class="el-icon" style="font-size: 26px;">
                                                <el-icon-files />
                                            </el-icon></label><span
                                            style="font-size:12px ;color: #fff;display: flex;justify-content: center;">线索分派</span>
                                    </div>
                                </div>
                                <div class="col-xs-3" style="padding: 10px;" @click="navigateToTargetPagexsgj">
                                    <div class="icon-box">
                                        <label
                                            style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;color: #fff;display: flex;align-items: center; justify-content: center;"><el-icon
                                                class="el-icon" style="font-size: 26px;">
                                                <el-icon-position />
                                            </el-icon></label><span
                                            style="font-size:12px ;color: #fff;display: flex;justify-content: center;">线索跟进</span>

                                    </div>
                                </div>
                                <div class="col-xs-3" style="padding: 10px; " @click="navigateToTargetPagewdxs">
                                    <div class="icon-box">
                                        <label
                                            style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;color: #fff;display: flex;align-items: center; justify-content: center;"><el-icon
                                                class="el-icon" style="font-size: 26px;">
                                                <el-icon-folder-checked />
                                            </el-icon></label><span
                                            style="font-size:12px ;color: #fff;display: flex;justify-content: center;">我的线索</span>
                                    </div>
                                </div>
                                <div class="col-xs-3" style="padding: 10px; " @click="navigateToTargetPagebb">
                                    <div class="icon-box">
                                        <label
                                            style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;color: #fff;display: flex;align-items: center; justify-content: center;"><el-icon
                                                class="el-icon" style="font-size: 26px;">
                                                <el-icon-folder-opened />
                                            </el-icon></label><span
                                            style="font-size:12px ;color: #fff;display: flex;justify-content: center;">客户报备</span>
                                    </div>
                                </div>

                                <div class="col-xs-3" style="padding: 10px;" @click="navigateToTargetPagelx">
                                    <div class="icon-box">
                                        <label
                                            style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;color: #fff;display: flex;align-items: center; justify-content: center;"><el-icon
                                                class="el-icon" style="font-size: 26px;">
                                                <el-icon-message />
                                            </el-icon></label><span
                                            style="font-size:12px ;color: #fff;display: flex;justify-content: center;">联系客户</span>
                                    </div>
                                </div>
                                <div class="col-xs-3" style="padding: 10px; " @click="navigateToTargetPagelxrgl">
                                    <div class="icon-box">
                                        <label
                                            style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;color: #fff;display: flex;align-items: center; justify-content: center;"><el-icon
                                                class="el-icon" style="font-size: 26px;">
                                                <el-icon-chat-line-square />
                                            </el-icon></label><span
                                            style="font-size:12px ;color: #fff;display: flex;justify-content: center;">联系人管理</span>
                                    </div>
                                </div>
                                <div class="col-xs-3" style="padding: 10px; " @click="navigateToTargetPagexjgl">
                                    <div class="icon-box">
                                        <label
                                            style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;color: #fff;display: flex;align-items: center; justify-content: center;"><el-icon
                                                class="el-icon" style="font-size: 26px;">
                                                <el-icon-coin />
                                            </el-icon></label><span
                                            style="font-size:12px ;color: #fff;display: flex;justify-content: center;">询价管理</span>
                                    </div>
                                </div>
                                <div class="col-xs-3" style="padding: 10px; " @click="navigateToTargetPagebjgl">
                                    <div class="icon-box">
                                        <label
                                            style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;color: #fff;display: flex;align-items: center; justify-content: center;"><el-icon
                                                class="el-icon" style="font-size: 26px;">
                                                <el-icon-money />
                                            </el-icon></label><span
                                            style="font-size:12px ;color: #fff;display: flex;justify-content: center;">报价管理</span>
                                    </div>
                                </div>
                                <div class="col-xs-3" style="padding: 10px; " @click="navigateToTargetPagebjsp">
                                    <div class="icon-box">
                                        <label
                                            style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;color: #fff;display: flex;align-items: center; justify-content: center;"><el-icon
                                                class="el-icon" style="font-size: 26px;">
                                                <el-icon-document-checked />
                                            </el-icon></label><span
                                            style="font-size:12px ;color: #fff;display: flex;justify-content: center;">报价审批</span>
                                    </div>
                                </div>
                                <div class="col-xs-3" style="padding: 10px; " @click="navigateToTargetPagezc">
                                    <div class="icon-box">
                                        <label
                                            style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;color: #fff;display: flex;align-items: center; justify-content: center;"><el-icon
                                                class="el-icon" style="font-size: 26px;">
                                                <el-icon-document />
                                            </el-icon></label><span
                                            style="font-size:12px ;color: #fff;display: flex;justify-content: center;">招商政策</span>
                                    </div>
                                </div>
                                <div class="col-xs-3" style="padding: 10px;" @click="navigateToTargetPagesq">
                                    <div class="icon-box">
                                        <label
                                            style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;color: #fff;display: flex;align-items: center; justify-content: center;"><el-icon
                                                class="el-icon" style="font-size: 26px;">
                                                <el-icon-copy-document />
                                            </el-icon></label><span
                                            style="font-size:12px ;color: #fff;display: flex;justify-content: center;">政策申请</span>
                                    </div>
                                </div>
                                <div class="col-xs-3" style="padding: 10px;" @click="navigateToTargetPagesqjd">
                                    <div class="icon-box">
                                        <label
                                            style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;color: #fff;display: flex;align-items: center; justify-content: center;"><el-icon
                                                class="el-icon" style="font-size: 26px;">
                                                <el-icon-finished />
                                            </el-icon></label><span
                                            style="font-size:12px ;color: #fff;display: flex;justify-content: center;">申请进度</span>
                                    </div>
                                </div>
                                <div class="col-xs-3" style="padding: 10px;" @click="navigateToTargetPageclgl">
                                    <div class="icon-box">
                                        <label
                                            style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;color: #fff;display: flex;align-items: center; justify-content: center;"><el-icon
                                                class="el-icon" style="font-size: 26px;">
                                                <el-icon-magic-stick />
                                            </el-icon></label><span
                                            style="font-size:12px ;color: #fff;display: flex;justify-content: center;">策略管理</span>
                                    </div>
                                </div>
                                <div class="col-xs-3" style="padding: 10px;" @click="navigateToTargetPageyygl">
                                    <div class="icon-box">
                                        <label
                                            style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;color: #fff;display: flex;align-items: center; justify-content: center;"><el-icon
                                                class="el-icon" style="font-size: 26px;">
                                                <el-icon-discount />
                                            </el-icon></label><span
                                            style="font-size:12px ;color: #fff;display: flex;justify-content: center;">预约管理</span>
                                    </div>
                                </div>
                                <div class="col-xs-3" style="padding: 10px;" @click="navigateToTargetPagerzgl">
                                    <div class="icon-box">
                                        <label
                                            style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;color: #fff;display: flex;align-items: center; justify-content: center;"><el-icon
                                                class="el-icon" style="font-size: 26px;">
                                                <el-icon-office-building />
                                            </el-icon></label><span
                                            style="font-size:12px ;color: #fff;display: flex;justify-content: center;">入驻管理</span>
                                    </div>
                                </div>
                                <div class="col-xs-3" style="padding: 10px;" @click="navigateToTargetPagesfgl">
                                    <div class="icon-box">
                                        <label
                                            style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;color: #fff;display: flex;align-items: center; justify-content: center;"><el-icon
                                                class="el-icon" style="font-size: 26px;">
                                                <el-icon-collection />
                                            </el-icon></label><span
                                            style="font-size:12px ;color: #fff;display: flex;justify-content: center;">收费管理</span>
                                    </div>
                                </div>
                                <div class="col-xs-3" style="padding: 10px;" @click="navigateToTargetPagetzgl">
                                    <div class="icon-box">
                                        <label
                                            style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;color: #fff;display: flex;align-items: center; justify-content: center;"><el-icon
                                                class="el-icon" style="font-size: 26px;">
                                                <el-icon-crop />
                                            </el-icon></label><span
                                            style="font-size:12px ;color: #fff;display: flex;justify-content: center;">退租管理</span>
                                    </div>
                                </div>
                            </div>
                        </template>
                    </sameCard>
                </div>
                <div class="clearfix"></div>
            </div>
        </el-tab-pane>
        <el-tab-pane label="产业载体" name="second">
            <div class="wrapper main-wrapper row">
                <div class="col-lg-12">
                    <section class="box nobox marginBottom0">
                        <div class="content-body">
                            <div class="row">
                                <smallCard>
                                    <template #cardbox>
                                        <div class="stats">
                                            <h3 class="color-white numbers">片区总数</h3>
                                            <span>Total number of precincts</span>
                                        </div>
                                    </template>
                                </smallCard>
                                <smallCardHover>
                                    <template #textOne>
                                        <div class="stats">
                                            <h3 class="numbers">楼宇总数</h3>
                                            <span>Total number of buildings</span>
                                        </div>
                                    </template>
                                </smallCardHover>
                                <smallCardHover>
                                    <template #textTwo>
                                        <div class="stats">
                                            <h3 class="numbers">企业总数</h3>
                                            <span>Total number of enterprises</span>
                                        </div>
                                    </template>
                                </smallCardHover>
                            </div>
                        </div>
                    </section>
                </div>
                <div class="clearfix"></div>
                <div class="content-wrapper">
                    <div class="hero-body">
                        <div class="row justify-content-center">
                            <div class="col-xxl-4">
                                <div class="card mb-5" style="height: 530px;">
                                    <div class="card-body">
                                        <div class="row gx-3">
                                            <div class="col-xxl-12">
                                                <div class="card-header row gx-3">
                                                    <div class="col-xl-12 col-sm-12 col-12">
                                                        <div class="head" style="margin-bottom: 20px;">
                                                            <p class="search-title">按楼宇查询注册企业</p>
                                                            <div class="head-input">
                                                                <el-input v-model="buildingInput"
                                                                    style="max-width: 600px" placeholder="请输入楼宇名称"
                                                                    class="input-with-select">
                                                                    <template #append>
                                                                        <el-button>搜索</el-button>
                                                                    </template>
                                                                </el-input>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div style="height: 351px;overflow-y: auto;">
                                                    <buildingLeft></buildingLeft>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-xxl-4">
                                <div class="card mb-5" style="height: 530px;">
                                    <div class="card-body">
                                        <div class="row gx-3">
                                            <div class="col-xxl-12">
                                                <div class="card-header row gx-3">
                                                    <div class="col-xl-12 col-sm-12 col-12">
                                                        <div class="building-center">
                                                            <div class="building-center-title">
                                                                <p class="title-text">中核路</p>
                                                                <el-badge :value="12" class="item">
                                                                    <el-button type="primary">楼宇数量</el-button>
                                                                </el-badge>
                                                            </div>

                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="center-pic">
                                                    <el-carousel trigger="click" arrow="always" :interval="5000">
                                                        <el-carousel-item v-for=" item in picData" :key="item.id">
                                                            <img :src="item.Url">
                                                        </el-carousel-item>
                                                    </el-carousel>
                                                </div>
                                                <div style="height: 202px;overflow-y: auto;">
                                                    <buildingCenter></buildingCenter>
                                                </div>
                                            </div>
                                        </div>

                                    </div>
                                </div>
                            </div>
                            <div class="col-xxl-4">
                                <div class="card mb-5" style="height: 530px;">
                                    <div class="card-body">
                                        <div class="row gx-3">
                                            <div class="col-xxl-12">
                                                <div class="card-header">
                                                    <div class="col-xl-12 col-sm-12 col-12">
                                                        <div class="card">
                                                            <div class="card-body"
                                                                style="font-size: 18px;background: #315fb6; color: #fff;border-radius: 10px;">
                                                                楼宇名称
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="row gx-4">
                                                        <div class=" col-xxl-3 col-sm-12 col-12 "
                                                            style="border: 1px solid #dbdbdb;margin-left: 10px;border-radius: 10px;padding: 30px 0px 10px 0px;">
                                                            <p
                                                                style="font-size: 35px;text-align: center;font-weight:bolder;color: #315fb6;">
                                                                0</p>
                                                            <p
                                                                style="font-size: 14px;text-align: center;font-weight: 800;">
                                                                注册企业数量</p>
                                                        </div>
                                                        <div class="col-xxl-7 col-sm-12 col-12 ">
                                                            <div id="pie" style="width: 100%;height: 180px;">
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="card-body" style="padding: 20px 5px;">
                                                        <div class="accordion-collapse" aria-labelledby=""
                                                            data-bs-parent="#accordionExample2">
                                                            <div class="row gx-3 accordion-collapse ">
                                                                <div style="height: 191px;overflow-y: auto;">
                                                                    <buildingRight></buildingRight>
                                                                </div>

                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
        </el-tab-pane>
        <el-tab-pane label="企业档案" name="third">
            <div class="wrapper main-wrapper row">
                <section class="box nobox marginBottom0">
                    <div class="content-body" style="width: 100%;">
                        <div class="row sift " style="height: 100px;">
                            <div class="content">
                                <h4 class="title">丰台区企业</h4>
                                <div class="sift-content">
                                    <el-select v-model="scaleValue" placeholder="按企业规模筛选" size="large"
                                        style="width: 160px;" class="enterprise-scale-select">
                                        <el-option v-for="item in scaleFiltering" :key="item.value" :label="item.label"
                                            :value="item.value" />
                                    </el-select>
                                    <el-select v-model="timeValue" placeholder="按注册时间筛选" size="large"
                                        style="width: 160px;" class="register-time-select">
                                        <el-option v-for="item in timeFiltering" :key="item.value" :label="item.label"
                                            :value="item.value" />
                                    </el-select>
                                    <el-select v-model="capitalValue" placeholder="按注册资本筛选" size="large"
                                        style="width: 160px;" class="registered-capital-select">
                                        <el-option v-for="item in capitalFiltering" :key="item.value"
                                            :label="item.label" :value="item.value" />
                                    </el-select>
                                    <el-select v-model="aptitudeValue" placeholder="按企业资质筛选" size="large"
                                        style="width: 250px;" class="enterprise-qualification-select">
                                        <el-option v-for="item in aptitudeFiltering" :key="item.value"
                                            :label="item.label" :value="item.value" />
                                    </el-select>
                                    <el-select v-model="industryValue" placeholder="按产业分类筛选" size="large"
                                        style="width: 160px;" class="industry-classification-select">
                                        <el-option v-for="item in industryClass" :key="item.value" :label="item.label"
                                            :value="item.value" />
                                    </el-select>
                                    <el-select v-model="aptitudeValue" placeholder="按行业分类筛选" size="large"
                                        style="width: 250px;" class="sector-classification-select">
                                        <el-option v-for="item in aptitudeFiltering" :key="item.value"
                                            :label="item.label" :value="item.value" />
                                    </el-select>
                                    <el-button type="primary">重置</el-button>

                                </div>

                            </div>
                        </div>
                        <div class="table">
                            <div class="top">
                                <el-button type="primary" style="margin: 20px 0;">总数量 &nbsp;|
                                    &nbsp;<span>205281</span></el-button>
                                <div class="search">
                                    <el-input v-model="input3" style="max-width: 600px" placeholder="查询"
                                        class="input-with-select">
                                        <template #append>
                                            <el-button>查询</el-button>
                                        </template>
                                    </el-input>
                                </div>
                            </div>

                            <el-table :data="tableData" border style="width: 100%">
                                <el-table-column type="selection" width="55" align="center" />
                                <el-table-column prop="name" label="企业名称" align="center" width="200" />
                                <el-table-column prop="time" label="成立时间" align="center" width="150" />
                                <el-table-column prop="address" label="注册地址" align="center" />
                                <el-table-column prop="scale" label="企业规模" align="center" width="100" />
                                <el-table-column prop="registeredCapital" label="注册资本" align="center" width="100" />
                                <el-table-column prop="classify" label="产业分类" align="center" width="200" />
                                <el-table-column prop="hangye" label="行业分类" align="center" width="200" />
                            
                            <el-table-column prop="qualification" label="企业资质" align="center" width="200" />
                                <el-table-column prop="collection" label="收藏" align="center" width="80">
                                    <el-switch v-model="switchValue" />
                                </el-table-column>
                                <el-table-column prop="view" label="查看" align="center" width="80">
                                    <template #default="scope">
                                        <el-button size="small" type="danger">
                                            查看
                                        </el-button>
                                    </template>
                                </el-table-column>

                            </el-table>
                            <div class="demo-pagination-block" style="margin: 30px 0;">

                                <el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize"
                                    :page-sizes="[100, 200, 300, 400]" :size="size" :disabled="disabled" background
                                    layout="total, sizes, prev, pager, next, jumper" :total="400"
                                    @size-change="handleSizeChange" @current-change="handleCurrentChange" />
                            </div>




                        </div>
                    </div>
                </section>

                <!-- </div> -->
            </div>


        </el-tab-pane>
        <el-tab-pane label="招商专题" name="fourth">招商专题</el-tab-pane>
    </el-tabs>
</template>

<script>
import smallCard from '@/components/scCard/smallCard'
import smallCardHover from '@/components/scCard/smallCardHover'
import mainImage from '@/components/scCard/mainImage'
import sameCard from '@/components/scCard/sameCard'
import pieCard from '@/components/scCard/pieCard'
import tableCard from '@/components/scCard/tableCard'
import buildingLeft from '@/views/personalCenter/FengtaiPark/components/buildingLeft'
import buildingCenter from '@/views/personalCenter/FengtaiPark/components/buildingCenter.'
import buildingRight from '@/views/personalCenter/FengtaiPark/components/buildingRight'
import '../FengtaiHome/jquery/amcharts.js'
import '../FengtaiHome/jquery/jquery-3.1.1.min.js'
import '../FengtaiHome/jquery/serial.js'
import '../FengtaiHome/jquery/toastr.min.js'
import $ from 'jquery'
import 'jquery-sparkline'
export default {
    components: {
        smallCard,
        smallCardHover,
        mainImage,
        sameCard,
        pieCard,
        tableCard,
        buildingLeft,
        buildingCenter,
        buildingRight
    },
    data() {
        return {
            // 折叠面板默认显示第一个
            activeName: 'first',
            // 搜索楼宇的value
            buildingInput: "",
            switchValue: false,
            currentPage: 1,
            pageSize: 100,
            tableData: [
                {
                    name: '五峰正浩工贸有限公司',
                    time: '2012-07-11',
                    address: '五峰土家族自治县湾潭镇小凤池村三组',
                    scale: '微型',
                    registeredCapital: '100',
                    classify: '轨道交通',
                    hangye:"制造业",
                    qualification:"高新技术企业-国家企业技术中心"
                },

                {
                    name: '五峰正浩工贸有限公司',
                    time: '2012-07-11',
                    address: '五峰土家族自治县湾潭镇小凤池村三组',
                    scale: '微型',
                    registeredCapital: '100',
                    classify: '轨道交通',
                    hangye:"制造业",
                    qualification:"高新技术企业-国家企业技术中心"
                },
                {
                    name: '五峰正浩工贸有限公司',
                    time: '2012-07-11',
                    address: '五峰土家族自治县湾潭镇小凤池村三组',
                    scale: '微型',
                    registeredCapital: '100',
                    classify: '轨道交通',
                    hangye:"制造业",
                    qualification:"高新技术企业-国家企业技术中心"
                },
                {
                    name: '五峰正浩工贸有限公司',
                    time: '2012-07-11',
                    address: '五峰土家族自治县湾潭镇小凤池村三组',
                    scale: '微型',
                    registeredCapital: '100',
                    classify: '轨道交通',
                    hangye:"制造业",
                    qualification:"高新技术企业-国家企业技术中心"
                },
                {
                    name: '五峰正浩工贸有限公司',
                    time: '2012-07-11',
                    address: '五峰土家族自治县湾潭镇小凤池村三组',
                    scale: '微型',
                    registeredCapital: '100',
                    classify: '轨道交通',
                    hangye:"制造业",
                    qualification:"高新技术企业-国家企业技术中心"
                },
                {
                    name: '五峰正浩工贸有限公司',
                    time: '2012-07-11',
                    address: '五峰土家族自治县湾潭镇小凤池村三组',
                    scale: '微型',
                    registeredCapital: '100',
                    classify: '轨道交通',
                    hangye:"制造业",
                    qualification:"高新技术企业-国家企业技术中心"
                },
                {
                    name: '五峰正浩工贸有限公司',
                    time: '2012-07-11',
                    address: '五峰土家族自治县湾潭镇小凤池村三组',
                    scale: '微型',
                    registeredCapital: '100',
                    classify: '轨道交通',
                    hangye:"制造业",
                    qualification:"高新技术企业-国家企业技术中心"
                },
                {
                    name: '五峰正浩工贸有限公司',
                    time: '2012-07-11',
                    address: '五峰土家族自治县湾潭镇小凤池村三组',
                    scale: '微型',
                    registeredCapital: '100',
                    classify: '轨道交通',
                    hangye:"制造业",
                    qualification:"高新技术企业-国家企业技术中心"
                },
                {
                    name: '五峰正浩工贸有限公司',
                    time: '2012-07-11',
                    address: '五峰土家族自治县湾潭镇小凤池村三组',
                    scale: '微型',
                    registeredCapital: '100',
                    classify: '轨道交通',
                    hangye:"制造业",
                    qualification:"高新技术企业-国家企业技术中心"
                },
                {
                    name: '五峰正浩工贸有限公司',
                    time: '2012-07-11',
                    address: '五峰土家族自治县湾潭镇小凤池村三组',
                    scale: '微型',
                    registeredCapital: '100',
                    classify: '轨道交通',
                    hangye:"制造业",
                    qualification:"高新技术企业-国家企业技术中心"
                }

            ],
            tableColumns: [
                { prop: 'DealIDNumber', label: 'Deal ID Number', width: '180' },
                { prop: 'TradeTime', label: 'Trade Time', width: '180' },
                { prop: 'Status', label: 'Status' },
                { prop: 'LastTrade', label: 'Last Trade' }
            ],
            // 按照企业规模筛选
            scaleValue: '',
            scaleFiltering: [
                { value: '大型', label: '大型' },
                { value: '中型', label: '中型' },
                { value: '小型', label: '小型' },
                { value: '微型', label: '微型' },
            ],
            // 按注册时间筛选
            timeValue: '',
            timeFiltering: [
                { value: '3个月内', label: '3个月内' },
                { value: '半年内', label: '半年内' },
                { value: '1年以内', label: '1年以内' },
                { value: '3-5年', label: '3-5年' },
                { value: '5-10年', label: '5-10年' },
                { value: '10年以上', label: '10年以上' },
            ],
            // 按注册资本筛选
            capitalValue: '',
            capitalFiltering: [
                { value: '0-100万', label: '0-100万' },
                { value: '100-200万', label: '100-200万' },
                { value: '200-500万', label: '200-500万' },
                { value: '500-1000万', label: '500-1000万' },
                { value: '1000-5000万', label: '1000-5000万' },
                { value: '5000万以上', label: '5000万以上' },
            ],
            // 按行业分类筛选
            sectorValue: '',
            sectorClass: [
               
                { value: '建筑业', label: '建筑业' },
                { value: '交通运输、仓储和邮政业', label: '交通运输、仓储和邮政业' },
                { value: '教育', label: '教育' },
                { value: '金融业', label: '金融业' },
                { value: '居民服务、修理和其他服务业', label: '居民服务、修理和其他服务业' },
                { value: '科学研究和技术服务业', label: '科学研究和技术服务业' },
                { value: '农、林、牧、渔业', label: '农、林、牧、渔业' },
                { value: '批发和零售业', label: '批发和零售业' },
                { value: '水利、环境和公共设施管理业', label: '水利、环境和公共设施管理业' },
                { value: '卫生和社会工作', label: '卫生和社会工作' },
                { value: '文化、体育和娱乐业', label: '文化、体育和娱乐业' },
                { value: '信息传输、软件和信息技术服务业', label: '信息传输、软件和信息技术服务业' },
                { value: '制造业', label: '制造业' },
                { value: '住宿和餐饮业', label: '住宿和餐饮业' },
                { value: '租赁和商务服务业', label: '租赁和商务服务业' },
                { value: '采矿业', label: '采矿业' },
                { value: '电力、热力、燃气及水生产和供应业', label: '电力、热力、燃气及水生产和供应业' },
                { value: '房地产业', label: '房地产业' },

            ],
            // 按产业分类筛选
            industryValue: '',
            industryClass: [
                { value: '轨道交通', label: '轨道交通' },
                { value: '航空航天', label: '航空航天' },
              

            ],
            // 按企业资质筛选
            aptitudeValue: '',
            aptitudeFiltering: [
            { value: '高新技术企业', label: '高新技术企业' },
                { value: '科技部科技型中小企业', label: '科技部科技型中小企业' },
                { value: '国家级制造业单项冠军示范企业', label: '国家级制造业单项冠军示范企业' },
                { value: '国家级制造业单项冠军产品企业', label: '国家级制造业单项冠军产品企业' },
                { value: '国家级制造业单项冠军培育企业', label: '国家级制造业单项冠军培育企业' },
                
                { value: '国家企业技术中心', label: '国家企业技术中心' },
                { value: '国家技术创新示范企业', label: '国家技术创新示范企业' },
                { value: '国家级科技企业孵化器', label: '国家级科技企业孵化器' },
                { value: '国家创投空间', label: '国家创投空间' },
                { value: '国家级专精特新“小巨人”企业', label: '国家级专精特新“小巨人”企业' },
                { value: '国家级重点实验室', label: '国家级重点实验室' },
                { value: '中国独角兽企业', label: '中国独角兽企业' },

                { value: '上市企业-汇总', label: '上市企业-汇总' },
                { value: '上市企业-A股', label: '上市企业-A股' },
                { value: '上市企业-港股', label: '上市企业-港股' },
                { value: '上市企业-美股', label: '上市企业-美股' },
                { value: '上市企业-新三板', label: '上市企业-新三板' },
                { value: '上市企业-新四板', label: '上市企业-新四板' },




                { value: '中小企协AAA信用', label: '中小企协AAA信用' },
                { value: '科技型初创企业', label: '科技型初创企业' },
                { value: '龙头企业', label: '龙头企业' },
                { value: '牛羚企业', label: '牛羚企业' },
                { value: '三同企业', label: '三同企业' },
                { value: '工程技术研究中心', label: '工程技术研究中心' },
                { value: '创新型企业', label: '创新型企业' },
                { value: '省级“专精特精”中小企业', label: '省级“专精特精”中小企业' },
                { value: '省级企业技术中心', label: '省级企业技术中心' },
                { value: '省级科技企业孵化器', label: '省级科技企业孵化器' },
                { value: '省级技术创新示范企业', label: '省级技术创新示范企业' },
                { value: '省级隐形冠军示范企业', label: '省级隐形冠军示范企业' },
                { value: '省级隐形冠军培育企业', label: '省级隐形冠军培育企业' },
                { value: '省级科技小巨人企业', label: '省级科技小巨人企业' },
                { value: '省级重点实验室', label: '省级重点实验室' },
                { value: '省级创新型中小企业', label: '省级创新型中小企业' },       
                { value: '省级技术先进型服务企业', label: '省级技术先进型服务企业' },
                { value: '省级民营科技企业', label: '省级民营科技企业' },
                { value: '省级独角兽企业', label: '省级独角兽企业' },     
                { value: '省级瞪羚企业', label: '省级瞪羚企业' },
                { value: '省级雏鹰企业', label: '省级雏鹰企业' }
            ],
            tableColumns: [
                { prop: 'DealIDNumber', label: 'Deal ID Number', width: '180' },
                { prop: 'TradeTime', label: 'Trade Time', width: '180' },
                { prop: 'Status', label: 'Status' },
                { prop: 'LastTrade', label: 'Last Trade' }
            ],
            //   轮播图图片
            picData: [
                {
                    id: 0,
                    Url: require("@/assets/images/building/lou01.png")
                },
                {
                    id: 1,
                    Url: require("@/assets/images/building/lou02.png")
                },
                {
                    id: 2,
                    Url: require("@/assets/images/building/lou03.png")
                }
            ]

        }
    },
    mounted() {
        this.initSparklines()
    },
    methods: {
        initSparklines() {
            $("#sparkline1").sparkline([14, 14, 4, 14, 10, 17, 14, 12, 9, 3, 9], {
                type: 'bar',
                barWidth: 4,
                height: '40px',
                barColor: '#fff',
                barSpacing: '5px',
                negBarColor: '#fff',
                width: '100%',
            });
            $("#sparkline2").sparkline([6, 7, 2, 0, 4, 2, 4, 5, 7, 2, 4], {
                type: 'bar',
                barWidth: 4,
                height: '40px',
                barColor: '#fff',
                barSpacing: '5px',
                negBarColor: '#fff',
                width: '100%',
            });
            $("#sparkline3").sparkline([6, 10, 17, 14, 12, 2, 4, 5, 7, 2, 8], {
                type: 'bar',
                barWidth: 4,
                height: '40px',
                barColor: '#fff',
                barSpacing: '5px',
                negBarColor: '#fff',
                width: '100%',
            });
            $("#sparkline4").sparkline([5, 6, 7, 2, 0, 4, 2, 10, 17, 14, 12], {
                type: 'bar',
                barWidth: 4,
                height: '40px',
                barColor: '#fff',
                barSpacing: '5px',
                negBarColor: '#fff',
                width: '100%',
            });
            // AnCharts 4 Start visitor statistic // 
            AmCharts.makeChart("visitor", {
                type: "serial",
                hideCredits: !0,
                theme: "light",
                dataDateFormat: "YYYY-MM-DD",
                precision: 2,
                valueAxes: [{
                    id: "v1",
                    title: "Visitors",
                    position: "left",
                    autoGridCount: !1,
                    labelFunction: function (e) {
                        return "$" + Math.round(e) + "M"
                    }
                }, {
                    id: "v2",
                    title: "New Visitors",
                    gridAlpha: 0,
                    position: "right",
                    autoGridCount: !1
                }],
                graphs: [{
                    id: "g3",
                    valueAxis: "v1",
                    lineColor: "#5395f9",
                    fillColors: "#5395f9",
                    fillAlphas: 1,
                    type: "column",
                    title: "Returning Visitor",
                    valueField: "sales2",
                    clustered: !1,
                    columnWidth: .5,
                    legendValueText: "$[[value]]M",
                    balloonText: "[[title]]<br /><b style='font-size: 130%'>$[[value]]M</b>"
                }, {
                    id: "g4",
                    valueAxis: "v1",
                    lineColor: "#0d5ef9",
                    fillColors: "#0d5ef9",
                    fillAlphas: 1,
                    type: "column",
                    title: "New visitor",
                    valueField: "sales1",
                    clustered: !1,
                    columnWidth: .3,
                    legendValueText: "$[[value]]M",
                    balloonText: "[[title]]<br /><b style='font-size: 130%'>$[[value]]M</b>"
                }, {
                    id: "g1",
                    valueAxis: "v2",
                    bullet: "round",
                    bulletBorderAlpha: 1,
                    bulletColor: "#FFFFFF",
                    bulletSize: 5,
                    hideBulletsCount: 50,
                    lineThickness: 2,
                    lineColor: "#0df3a3",
                    type: "smoothedLine",
                    title: "Last Month Visitor",
                    useLineColorForBulletBorder: !0,
                    valueField: "market1",
                    balloonText: "[[title]]<br /><b style='font-size: 130%'>[[value]]</b>"
                }, {
                    id: "g2",
                    valueAxis: "v2",
                    bullet: "round",
                    bulletBorderAlpha: 1,
                    bulletColor: "#FFFFFF",
                    bulletSize: 5,
                    hideBulletsCount: 50,
                    lineThickness: 2,
                    lineColor: "#fe5d70",
                    dashLength: 5,
                    title: "Average Visitor",
                    useLineColorForBulletBorder: !0,
                    valueField: "market2",
                    balloonText: "[[title]]<br /><b style='font-size: 130%'>[[value]]</b>"
                }],
                chartCursor: {
                    pan: !0,
                    valueLineEnabled: !0,
                    valueLineBalloonEnabled: !0,
                    cursorAlpha: 0,
                    valueLineAlpha: .2
                },
                categoryField: "date",
                categoryAxis: {
                    parseDates: !0,
                    dashLength: 1,
                    minorGridEnabled: !0
                },
                legend: {
                    useGraphSettings: !0,
                    position: "top"
                },
                balloon: {
                    borderThickness: 1,
                    cornerRadius: 5,
                    shadowAlpha: 0
                },
                dataProvider: [{
                    date: "2013-01-16",
                    market1: 71,
                    market2: 75,
                    sales1: 5,
                    sales2: 8
                }, {
                    date: "2013-01-17",
                    market1: 74,
                    market2: 78,
                    sales1: 4,
                    sales2: 6
                }, {
                    date: "2013-01-18",
                    market1: 78,
                    market2: 88,
                    sales1: 5,
                    sales2: 2
                }, {
                    date: "2013-01-19",
                    market1: 85,
                    market2: 89,
                    sales1: 8,
                    sales2: 9
                }, {
                    date: "2013-01-20",
                    market1: 82,
                    market2: 89,
                    sales1: 9,
                    sales2: 6
                }, {
                    date: "2013-01-21",
                    market1: 83,
                    market2: 85,
                    sales1: 3,
                    sales2: 5
                }, {
                    date: "2013-01-22",
                    market1: 88,
                    market2: 92,
                    sales1: 5,
                    sales2: 7
                }, {
                    date: "2013-01-23",
                    market1: 85,
                    market2: 90,
                    sales1: 7,
                    sales2: 6
                }, {
                    date: "2013-01-24",
                    market1: 85,
                    market2: 91,
                    sales1: 9,
                    sales2: 5
                }, {
                    date: "2013-01-25",
                    market1: 80,
                    market2: 84,
                    sales1: 5,
                    sales2: 8
                }, {
                    date: "2013-01-26",
                    market1: 87,
                    market2: 92,
                    sales1: 4,
                    sales2: 8
                }, {
                    date: "2013-01-27",
                    market1: 84,
                    market2: 87,
                    sales1: 3,
                    sales2: 4
                }, {
                    date: "2013-01-28",
                    market1: 83,
                    market2: 88,
                    sales1: 5,
                    sales2: 7
                }, {
                    date: "2013-01-29",
                    market1: 84,
                    market2: 87,
                    sales1: 5,
                    sales2: 8
                }, {
                    date: "2013-01-30",
                    market1: 81,
                    market2: 85,
                    sales1: 4,
                    sales2: 7
                }]
            });
        },
        navigateToTargetPagemb() {

            //目标客户池
            this.$router.push('/crm/pool/customer');

        },
        navigateToTargetPagewdsc() {

            //我的收藏
            this.$router.push('/enterprise/store');

        },
        navigateToTargetPagexs() {

            //线索管理
            this.$router.push('/office/aitask/manage');
        },
        navigateToTargetPagexsfp() {

            //线索分派
            this.$router.push('/office/aitask/allocation');
        },
        navigateToTargetPagexsgj() {

            //线索跟进
            this.$router.push('/office/aitask/hold');
        },
        navigateToTargetPagewdxs() {
            //我的线索
            this.$router.push('/office/aitask/search');
        },
        navigateToTargetPagebb() {

            //客户报备
            this.$router.push('/crm/customer');
        },
        navigateToTargetPagelx() {

            //联系客户
            this.$router.push('/crm/contract');
        },
        navigateToTargetPagelxrgl() {

            //联系人管理
            this.$router.push('/crm/linkman');
        },
        navigateToTargetPagexjgl() {

            //询价管理
            this.$router.push('/crm/inquiry');
        },
        navigateToTargetPagebjgl() {

            //报价管理
            this.$router.push('/crm/quotation');
        },
        navigateToTargetPagebjsp() {

            //报价审批
            this.$router.push('/crm/quotation/approved');
        },
        navigateToTargetPagezc() {
            //招商政策
            this.$router.push('/crm/policytype');
        },
        navigateToTargetPagesq() {
            //政策申请
            this.$router.push('/crm/policyprogress');
        },
        navigateToTargetPagesqjd() {
            //申请进度
            this.$router.push('/crm/policyapply');
        },
        navigateToTargetPageclgl() {
            //策略管理
            this.$router.push('/attractinvestment/note');
        },
        navigateToTargetPageyygl() {
            //预约管理
            this.$router.push('/attractinvestment/appointment');
        },
        navigateToTargetPagerzgl() {
            //入驻管理
            this.$router.push('/attractinvestment/checkin');
        },
        navigateToTargetPagesfgl() {
            //收费管理
            this.$router.push('/attractinvestment/chargeManage');
        },
        navigateToTargetPagetzgl() {
            //退租管理
            this.$router.push('/attractinvestment/checkoutManage');
        },



    }
}
</script>

<style scoped lang="scss">
/* 引入css */
@import "@/views/personalCenter/css/index.css";
@import "@/views/personalCenter/FengtaiPark/css/index.css";

.numbers {
    font-size: 35px;
}

::v-deep .el-collapse-item__header {
    font-size: 20px !important;
}

.demo-tabs>.el-tabs__content {
    padding: 32px;
    color: #6b778c;
    font-size: 32px;
    font-weight: 600;
}

::v-deep .el-tabs__nav-scroll {
    display: flex;
    justify-content: center;
    height: 60px;
    line-height: 90px;
}

::v-deep .el-tabs__item {
    font-size: 30px;
}

::v-deep .el-collapse-item__header {
    font-size: 20px !important;
}

.demo-tabs>.el-tabs__content {
    padding: 32px;
    color: #6b778c;
    font-size: 32px;
    font-weight: 600;
}

::v-deep .el-tabs__nav-scroll {
    display: flex;
    justify-content: center;
    height: 60px;
    line-height: 90px;
}

::v-deep .el-tabs__item {
    font-size: 30px;
}

.content-body .sift,
.table {
    background-color: #fff;
    // height: 100px;
    border-radius: 7px;
    width: 98%;
    margin: auto;
    border: 1px solid #b7c6d8;
    margin-bottom: 16px;
    box-shadow: rgba(76, 78, 100, .2) 0px 2px 10px 0px;
    padding: 0 20px;

    .title {
        font-weight: 600;
    }

}

.table {
    margin-top: 50px;

    .top {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
}

::v-deep .el-dropdown {
    margin-right: 20px;
}

::v-deep .el-select {
    margin-right: 20px
}

::v-deep .el-input-group__append button.el-button {
    background-color: #409EFF;
    color: #fff;
}

:deep .el-carousel__container {
    height: 223px;
    img {
        height: 200px;
        width: 480px;
    }
}

.search-title,
.title-text {
    font-size: 20px;
    font-weight: 600;
}

.building-center {
    width: 443px;
    margin: auto;

    .building-center-title {
        display: flex;

        .title-text {
            margin-right: 50px;
        }
    }


}
</style>